<template>
    <view :class="themeName">
        <view class="transfer-record">
            <u-tabs font-size="28" name="tabsName" inactive-color="#333" :active-color="themeColor" :list="list"
                :is-scroll="false" :current="current" @change="change">
            </u-tabs>
        
            <mescroll-uni ref="mescrollRef" bgColor="white" top="90rpx" @init="mescrollInit" :down="downOption"
                :up="upOption" @down="downCallback" @up="upCallback">
        
                <view class="list m-t-20" v-if="lists.length !== 0">
                    <view v-for="(item, index) in lists" :key="index" class="item bg-white flex">
                        <view class="flex-none m-r-20">
                            <u-image width="68rpx" height="68rpx" border-radius="50%" :src="item.avatr"></u-image>
                        </view>
                        <view class="flex-1 m-r-20">
                            <view class="black m-b-10">{{item.nickname}}</view>
                            <view class="xs muted">会员ID:{{item.sn}}</view>
                            <view class="xs muted">{{item.create_time}}</view>
                        </view>
                       <view theme class="lg flex-none ">
                           {{item.money_desc}}
                       </view>
                    </view>
                </view>
        
            </mescroll-uni>
        
        </view>
    </view>
</template>

<script>
    // +----------------------------------------------------------------------
    // | LikeShop100%开源免费商用电商系统
    // +----------------------------------------------------------------------
    
    
    // | 商业版本务必购买商业授权，以免引起法律纠纷
    // | 禁止对系统程序代码以任何目的，任何形式的再发布
    // | Gitee下载：https://gitee.com/likeshop_gitee/likeshop
    // | 访问官网：https://www.likemarket.net
    // | 访问社区：https://home.likemarket.net
    // | 访问手册：http://doc.likemarket.net
    // | 微信公众号：好象科技
    // | 好象科技开发团队 版权所有 拥有最终解释权
    // +----------------------------------------------------------------------
    // | Author: LikeShopTeam
    // +----------------------------------------------------------------------
    import {
        transferRecord
    } from "@/api/user";
    import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
    import MescrollMoreItemMixin from "@/components/mescroll-uni/mixins/mescroll-more-item.js";
    export default {
        mixins: [MescrollMixin, MescrollMoreItemMixin],
        data() {
            return {
                list: [{
                    tabsName: '全部',
                    isShow: true,
                    type: ''
                }, {
                    tabsName: '转入',
                    isShow: false,
                    type: 'in'
                }, {
                    tabsName: '转出',
                    isShow: false,
                    type: 'out'
                }],
                current: 0,
                lists: [],

                downOption: {
                    auto: false // 不自动加载 (mixin已处理第一个tab触发downCallback)
                },
                upOption: {
                    auto: true, // 不自动加载
                    noMoreSize: 4, //如果列表已无数据,可设置列表的总数量要大于半页才显示无更多数据;避免列表数据过少(比如只有一条数据),显示无更多数据会不好看; 默认5
                    empty: {
                        icon: '/static/images/empty/order.png',
                        tip: '暂无转账记录', // 提示
                        fixed: true,
                        top: "200rpx",
                    }
                }
            };
        },

        methods: {
            change(index) {
                for (let i = 0; i < this.list.length; i++) {
                    this.list[i].isShow = false
                }
                this.current = index;
                this.upCallback({
                    num: 1,
                    size: 10
                });
                this.list[index].isShow = true
            },

            upCallback(page) {
                let num = page.num;
                let size = page.size

                transferRecord({
                    type: this.list[this.current].type,
                    page_no: num,
                    page_size: size
                }).then(res => {
                    if (page.num == 1) this.lists = []; //如果是第一页需手动置空列表
                    this.lists = this.lists.concat(res.lists); //追加新数据
                    this.mescroll.endSuccess(res.lists.length, res.more == 0 ? false : true, '');
                }).catch(err => {
                    this.mescroll.endErr()
                })

            }
        },
        
        onShow() {
            this.upCallback({num: 1,size: 10})
        }
    };
</script>
<style lang="scss">
    .transfer-record {
        .list {
            .item {
                padding: 20rpx 30rpx;
                border-bottom: $-solid-border;
                align-items: flex-start;
            }
        }
    }
</style>
